<template>
  <div>
    <svg-icon
      icon-class="fullscreen"
      style="color:#fff;width:20px;height:20px"
      @click="changeScreen"
    />
  </div>
</template>

<script>
import ScreenFull from 'screenfull'
export default {
  methods: {
    changeScreen() {
      // document.documentElement.requestFullscreen() // 原生方式 进入全屏显示
      // document.exitFullscreen()  // 原生方式 关闭全屏显示

      // 使用screenfull插件实现全屏的显示与关闭
      if (!ScreenFull.isEnabled) { // 内置判断
        this.$message.error('不能点击')
      } else {
        ScreenFull.toggle() // 全屏的方法
      }
    }
  }
}
</script>

<style>

</style>
